Async testing #21
Async testing #21
Conversation
CalebCyphers
added
enhancement
| @@ -55,6 +36,11 @@ class App extends Component { | |||
| /> | |||
| </Col> | |||
| </Row> | |||
| <Row className="d-flex justify-content-center"> | |||
| <Col md="auto"> | |||
| {this.state.error && <Alert variant="danger">{this.state.error}</Alert>} | |||
|
|
||
| const returnHome = jest.fn(); | ||
|
|
||
| describe("NavBar", () => { |
There was a problem hiding this comment.
future note: For Iteration 5, we could add a search input into the navbar
| @@ -13,31 +13,12 @@ class App extends Component { | |||
| super(); | |||
| this.state = { | |||
| movies: [], | |||
| selectedMovie: 0, | |||
| selectedMovie: null, | |||
There was a problem hiding this comment.
Can the initial value for this be an empty object instead of null? Always best to avoid mutating the data type.
| @@ -91,6 +77,25 @@ class App extends Component { | |||
| </React.Fragment> | |||
There was a problem hiding this comment.
Fun fact: you can create a react fragment with the shorthand <> </>
| componentDidMount() { | ||
| getMovies() | ||
| .then((response) => this.setState({ movies: response.movies })) | ||
| .then(this.setState({ loader: false })) |
There was a problem hiding this comment.
If the loading message is dependent solely on if there are movies rendered or not, we can remove this part of state and just check on this.state.moves! However if more than one condition can set this to true, then it can stay.
| getMovies() | ||
| .then((response) => this.setState({ movies: response.movies })) | ||
| .then(this.setState({ loader: false })) | ||
| .catch((err) => this.setState({ error: err })); |
There was a problem hiding this comment.
Be sure that "err" is a string as the initial state indicates, and not an object with an error message inside it.
|
|
||
| returnToHome = (event) => { | ||
| this.setState({ | ||
| selectedMovie: 0, |
There was a problem hiding this comment.
It looks like the default value of selectedMovie should be 0 instead of null!
|
|
||
| // should be able to click on a movie card |
There was a problem hiding this comment.
I LOVE the pseudocoding! This is a great workflow!
|
|
||
| userEvent.click(movieCardPoster); | ||
|
|
||
| expect(handleClick).toHaveBeenCalled(); |
What does this PR do?
Where should the reviewer start?
How should this be manually tested?
What are the relevant tickets?